<template>
  <v-md-editor
    :placeholder="placeholder"
    :disabled-menus="[]"
    v-model="newValue"
    :height="height"
    @change="handleChange"
  ></v-md-editor>
</template>
<script lang="ts" setup>
import { computed } from 'vue'
interface Props {
  modelValue: string
  height?: string
  placeholder?: string
}
interface EmitEvent {
  (e: 'update:modelValue', params: string): void
}
const props = withDefaults(defineProps<Props>(), {
  height: '500px',
  placeholder: '请输入内容'
})
const emit = defineEmits<EmitEvent>()
const newValue = computed({
  get() {
    return props.modelValue
  },
  set(value: string) {
    emit('update:modelValue', value)
  }
})
const handleChange = (text: string, html: string) => {
  console.log(html)
}
</script>
<style lang="less" scoped></style>
